import { ChangeDetectionStrategy, Component } from '@angular/core';
import { TreeNode } from '@iux/live';

@Component({
  selector: 'app-search',
  templateUrl: './search.component.html',
  styles: [
    `
      .tree-container {
        display: flex;
        flex-direction: column;
        box-sizing: content-box;
        width: 360px;
        padding: 16px;
        border: 1px solid #e6e6e6;
      }
      .tree-container .lv-search {
        width: 100%;
        margin-bottom: 8px;
      }
    `,
  ],
  changeDetection: ChangeDetectionStrategy.OnPush,
})
export class SearchComponent {
  data: TreeNode[] = [
    {
      label: 'root node 1',
      disabled: true,
      expanded: true,
      children: [
        {
          label: 'child node 1-1 long long long long long long long long long long long long name.doc',
          expanded: true,
          children: [
            { label: 'leaf node 1-1-1', isLeaf: true },
            { label: 'leaf node 1-1-2', isLeaf: true },
          ],
        },
        {
          label: 'child node 1-2',
          children: [
            { label: 'leaf node 1-2-1', isLeaf: true },
            { label: 'leaf node 1-2-2', isLeaf: true },
          ],
        },
      ],
    },
    {
      label: 'root node 2',
      children: [
        {
          label: 'leaf node 2-1',
          isLeaf: true,
        },
        {
          label: 'child node 2-2',
          children: [
            { label: 'leaf node 2-2-1', isLeaf: true },
            { label: 'leaf node 2-2-2', isLeaf: true },
          ],
        },
      ],
    },
    {
      label: 'root node 3',
      children: [
        {
          label: 'leaf node 3-1',
          isLeaf: true,
        },
        {
          label: 'leaf node 3-2',
          isLeaf: true,
        },
      ],
    },
  ];
  value: string = '';
  constructor() {}
}
